import {
  createRouter,
  createWebHistory,
  createWebHashHistory
} from 'vue-router'
import Layout from '@/Layout'

export const constantRoutes = [
  {
    path: '/login',
    name: 'login',
    component: () => import('@/views/login'),
    hidden: true
  },
  // 菜单栏中的路由都应该在"/"中的子路由生成(动态和静态),因为整体首页页面就是一个路由
  {
    path: '/',
    name: '/',
    component: Layout,
    redirect: '/main',
    children: [
      {
        path: '/main',
        name: '首页',
        component: () => import('@/views/main/index.vue')
      }
    ]
  },
  {
    path: '/:catchAll(.*)',
    name: '404',
    component: () => import('@/views/404.vue'),
    hidden: true
  }
]

// 任意路由需要在所有路由下面
// 其中 vue3使用 /:pathMatch(.*) 或 /:catchAll(.*) ; vue2 使用 *
export const anyRoute = {
  path: '/:catchAll(.*)',
  name: '404',
  component: () => import('@/views/404.vue'),
  hidden: true
}

const createRouters = () =>
  createRouter({
    history: createWebHistory(),
    scrollBehavior(to, from, savedPosition) {
      // 始终滚动到顶部
      return { top: 0 }
    },
    routes: constantRoutes
  })

const router = createRouters()

// Vue3中没有matcher,不能实现重置路由，需要使用removeRouter()
// 退出登陆清除增加的路由的bug尚未解决，目前使用的是刷新重载的方法
/* export function resetRouter() {
  const newRouter = createRouters()
  router.matcher = newRouter.matcher
} */

export default router
